/*
*= require_tree ./plugin
*= require uikit/css/uikit.min.css
*= require uikit/css/components/placeholder.css
*= require uikit/css/components/notify.css
*= require uikit/css/components/sticky.css
*= require uikit/css/components/form-file.css
*= require uikit/css/components/form-select.css
*= require uikit/css/components/datepicker.css
*= require uikit/css/components/slidenav.css
*= require uikit/css/components/tooltip.css
*= require select2/dist/css/select2.min.css
*= require_tree ../plugins/jedate/skin
*= require zTree/css/zTreeStyle/zTreeStyle.css
*= require_self
*/
@import "backend/admin";

.hover-trash {
  display: block;
  width: 300%;
  line-height: 30px;
  height: 30px;
}

.hover-trash:hover {
  .hover-show {
    display: block;
  }
}


.hover-show {
  display: none;
}

.district-item-padding {
  padding: 7px;
}

.district-item-width {
  width: 300%;
}

.radio {
  input {
    margin: 0px 5px;
  }
}


.format-money {
  text-align: right;
}

.select2 {
  .selection {
    width: 100%;
  }
}

//simple_form
.radio_buttons {
  .uk-form-controls {
    & > span {
      height: 36px;
      padding: 9px 0;
      margin-right: 10px;

      label input[type="radio"] {
        margin-top: 1px;
      }
    }
  }
}

.auto-img {
  height: 35vh;
  width: 52vh;
  background: url(image-path("auto.png"));
  background-repeat: no-repeat;
  background-size: 100%;
}

#auto-assess {
  height: 35vh;
  position: relative;
  z-index: 3;
}
.signature{
  width:40%;
}
.assess {
  & > p {
    padding: 15px 16px;
    font-size: 14px;
    color: #464646;
  }
}

.assess_item {
  width: 100%;
  display: flex;
  padding: 0 10%;
  margin-bottom: 20px;

  div {
    flex: 1;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border: 1px solid #E2E2E2;
    border-radius: 3px;
    & + div {
      margin-left: 20px;

      span {
        position: relative;

        &:after {
          width: 14px;
          height: 14px;
          content: '';
          position: absolute;
          left: -19px;
          bottom: 13px;
          border-radius: 50%;
          background-color: #7ED321;
        }
      }
    }

    .triangle {
      font-size: 14px;
      position: relative;
      padding-left: 20px;

      &:after {
        width: 14px;
        height: 14px;
        content: '';
        position: absolute;
        left: 0;
        bottom: 13px;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        border-bottom: 13px solid #546BEF;
      }

    }
  }


}

.print-page {
  .uk-table {
    font-size: 13px;

    td {
      padding: 5px;
    }

    th {
      padding: 5px;
    }

  }

  .uk-table-striped tbody tr:nth-of-type(odd) {
    border: 1px solid #333;
  }

  .uk-table-striped thead tr {
    border: 1px solid #333;
  }

  .uk-table-striped tbody tr:nth-of-type(even) {
    border: 1px solid #333;
  }
}

.position-history {
  a {
    color: #94a1b3;
    text-decoration: none;
    cursor: pointer;
  }

  a:hover {
    color: #94a1b3;
  }
}

.canvas-container {
  position: relative;
  text-align: center;
  width: 376px;
  height: 263px;
}

.canvas {
  position: absolute;
  top: 0;
  left: 0px;
  z-index: 1;
}

.canvas_bgp {
  width: 376px;
  height: 263px;
  position: absolute;
  top: 0;
  left: 0px;
}

.grid-form {

}

.guide-body{
  width: 600px;
  margin: 5% auto 0;
  text-align: center;
  .guide-logo_img{
    width: 120px;
  }
  .guide-div{
    width: 100%;
    display: flex;
    align-items: center;
    & > div{
      flex: 1;
      margin-top: 60px;
      p{
        margin-top: 10px;
      }
    }
  }
  .guide-div > div:nth-child(odd){
    flex: 0 0 254px;
    & > div{
      width: 206px;
      height: 206px;
      margin: 20px auto 0;
    }
  }
  .guide-div > div:nth-child(even){
    padding-top: 80px;
    img{
      width: 60px;
    }
  }
}
